<template>
    <div id="app">

        <div class="mask"></div>
        <!--非登录视图-->
        <router-view></router-view>
   </div>

</template>

<script>
    import * as types from './store/types';
    import {mapState} from 'vuex';
//    import siderbar from './components/sideBar.vue';
//    import headbar from './components/headBar.vue';
//    import navbar from './components/navBar.vue';
    export default {
        name: 'app',
        data () {
            return {
                SidebarStatus:true,
                refresh:''
            }
        },
        computed:{
            isLogin : function () {
                console.log(this.$store.getters.getIslogin);
                return this.$store.getters.getIslogin;
            }
        },
        components:{//引用组件
//            siderbar:siderbar,
//            headbar:headbar,
//            navbar:navbar,
        },
      methods: {
          logout(){
            this.$store.commit(types.LOGOUT)
            this.$router.push({
              path: '/login'
            })
          },
          toggleSidebar(){//侧边栏开合
              this.SidebarStatus = !this.SidebarStatus;
          },
          change(){
              console.log('APP component have received...')
              this.refresh = new Date().getTime();
          }
      }
    }
</script>


<style lang="scss">
    @import "../bower_components/rdash-ui/dist/css/rdash.css" ;
    @import "../bower_components/bootstrap/dist/css/bootstrap.css" ;
    @import "../bower_components/font-awesome/css/font-awesome.css";
    @import "../bower_components/ladda/dist/ladda.min.css";
    @import "../bower_components/magic-check/css/magic-check.css";
    @import "./assets/pure.css";

    body {
        font-family:"Microsoft YaHei";
        font-size: 14px;
        color: #2a3542;
        min-width: 1024px;
        background-color: #ebeef2;
    }
    a{
        color:#2a3542 ;
    }
    a:hover{
        color:#2a3542 ;
    }
    .tooltip-inner{
        background-color: #374351;
        font-size: 12px;
        /*margin-top: 220px;*/
    }
    .tooltip.right .tooltip-arrow {
        border-right-color: #374351;
    }
    #page-wrapper.open {
        padding-left: 180px;
    }

    .page-content .btn:hover{
       background-color: #51b5fa;
        color: #ffffff;
    }

    .btn{
        color:#fff;background-color: #2ea5f8;
    }
    .btn:hover{
        background-color: #51b5fa;
        color: #ffffff;
    }

    .btn:active:focus {
        background-color: #007dd5;
        outline:0;
        outline-offset: 0;
        color: #ffffff;
        box-shadow:none;
    }

    .btn:focus {
        background-color: #2ea5f8;
        outline:0;
        outline-offset: 0;
        color: #ffffff;
    }

    .btnE{
        color:#2ea5f8;
        background-color: #ffffff;
        border: solid 1px #2ea5f8;
    }
    .btnE:hover{
        background-color: #e8f8fe;
        color: #2ea5f8;
    }

    .btnE:active:focus {
        background-color: #c3efff;
        outline:0;
        outline-offset: 0;
        color: #2ea5f8;
        box-shadow:none;
    }

    .btnE:focus {
        background-color: #ffffff;
        outline:0;
        outline-offset: 0;
        color: #2ea5f8;
    }





</style>
